<template>
  <div>
    <h1>医疗诊断系统</h1>
    <form @submit.prevent="diagnose">
      <div>
        <label for="name">姓名:</label>
        <input type="text" id="name" v-model="patient.name" required>
      </div>
      <div>
        <label for="age">年龄:</label>
        <input type="number" id="age" v-model.number="patient.age" required>
      </div>
      <div>
        <label for="height">身高 (cm):</label>
        <input type="number" id="height" v-model.number="patient.height" required>
      </div>
      <div>
        <label for="weight">体重 (kg):</label>
        <input type="number" id="weight" v-model.number="patient.weight" required>
      </div>
      <div>
        <label for="medicalHistory">病史:</label>
        <textarea id="medicalHistory" v-model="patient.medicalHistory"></textarea>
      </div>
      <button type="submit">提交</button>
    </form>
    <div v-if="result">
      <h2>诊断结果</h2>
      <p>BMI: {{ bmi.toFixed(2) }}</p>
      <p>{{ result }}</p>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      patient: {
        name: '',
        age: null,
        height: null,
        weight: null,
        medicalHistory: ''
      },
      result: '',
      bmi: 0
    };
  },
  methods: {
    diagnose() {
      this.bmi = this.calculateBMI();
      this.result = this.getHealthStatus(this.bmi);
    },
    calculateBMI() {
      return this.patient.weight / ((this.patient.height / 100) ** 2);
    },
    getHealthStatus(bmi) {
      if (bmi <= 18.5) return '体重过轻';
      if (bmi <= 24.9) return '正常';
      if (bmi <= 29.9) return '体重过重';
      return '肥胖';
    }
  }
};
</script>

<style scoped>
/* 添加一些基本样式 */
/* form {
  display: flex;
  flex-direction: column;
  gap: 10px;
} */
</style>